// 构建侧边栏项
function buildSideItem(title, index) {
    const sideItemDom = document.createElement('div')
    sideItemDom.className = ['side-item', (index === currentSideIndex ? 'active' : '')].join(' ')
    sideItemDom.id = `side-item-${index}`
    sideItemDom.title = title
    sideItemDom.addEventListener('click', function () {
        handleSideItemClick(index)
    })
    sideItemDom.innerText = title
    return sideItemDom
}

// 监听侧边栏项点击
function handleSideItemClick(index, cb) {
    if (currentSideIndex === index) return
    sideItemList[currentSideIndex].classList.remove('active')
    sideItemList[index].classList.add('active')

    currentSideIndex = index

    currentVueInfo = vueMap[vueNames[currentSideIndex]]
    buildBaseInfo()
    buildInfo()
    buildGitLog()

    global.buildProps()
    global.buildSlot()
    global.buildEvent()
}

// 构建侧边栏
function buildSide() {
    for (let i = 0; i < vueNames.length; i++) {
        const vueName = vueNames[i]
        sideItemList.push(buildSideItem(vueName, i))
    }
    sideContainer.append(...sideItemList)
}

buildSide()
